import { AfterViewInit, Component, Injector, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { Subject } from 'rxjs';
import { ConfigModule } from 'src/app/config.module';
import { SystemMenu } from '../../../../models/system/system-menu.model';
import { DeptService } from '../service/dept.service';
import * as _ from 'lodash';
import { listAnimation } from '../../../../animations/list.animation';
import { BaseUI } from '../../../../common/base';
import { TreeUtils } from '../../../../utils/TreeUtils';
import { DeptOptionComponent } from '../component/dept-option/dept-option.component';

@Component({
    selector: 'app-dept',
    templateUrl: './index.component.html',
    styleUrls: ['./index.component.scss'],
    animations: [listAnimation]
})
export class DeptComponent extends BaseUI implements OnInit, AfterViewInit, OnDestroy {
    modalLoadingState: boolean;
    onDestroy$: Subject<any> = new Subject<any>();
    searchObj:any = {};
    loadingState: boolean;

    listLoadingState = false; //菜单列表加载状态
    entityTree: Array<SystemMenu> = []; //菜单列表数据
    expandState = true; //展开状态
    constructor(
        public _config: ConfigModule,
        private mainService: DeptService,
        private _injector: Injector,
    ) {
        super(_injector);
    }

    ngOnInit() {
        this.searchList()
    }

    ngAfterViewInit() {}

    ngOnDestroy() {
    }





    /**
     * 获取列表
     */
    searchList() {
        this.listLoadingState = true;
        this.mainService.list(this.searchObj)
            .subscribe((res) => {
                if (res.success){
                    this.entityTree = TreeUtils.buildTree(res.data,'parentId','deptId',this.expandState);
                    // this.onSetTreeLevel(this.entityTree, 0);
                }else {
                    super.messageService.error(res.msg);
                }
            })
            .add(() => {
                this.setMiniTableHeight();
            });
    }

    setMiniTableHeight() {
        let height = window.innerHeight -236;
        this.el.nativeElement.querySelector('.ant-table-body').style.maxHeight = height + 'px';
        this.el.nativeElement.querySelector('.ant-table-body').style.height = height+ 'px'
    }

    /**
     * 设置菜单的level层级
     * @param array 需要转换的原始数组
     * @param level 要设置的层级
     */
    onSetTreeLevel(array: any, level: number) {
        _.forEach(array, (item) => {
            if (!item.level) {
                item.level = level;
            }
            if (item.children) {
                const _level = item.level + 1;
                this.onSetTreeLevel(item.children, _level);
            }
        });
    }

    /**
     * 点击展开所有的节点
     */
    onExpandAll() {
        this.expandAll(this.entityTree, !this.expandState)
        this.expandState = !this.expandState;
    }

    /**
     * 展开全部的菜单节点
     */
    expandAll(array: any, status: boolean) {
        _.forEach(array, (item: { children: any; expand: boolean }) => {
            item.expand = status;
            if (item.children) {
                this.expandAll(item.children, status);
            }
        });
    }



    /**
     * 删除
     */
    onDelete(id: string, deleteRef: any) {
        deleteRef.innerHTML = this._config.loadingIcon;
        this.mainService.delete(id).subscribe(
            (res) => {
                if (res.code == 200) {
                        this.searchList();
                } else {
                    deleteRef.innerHTML = '删除';
                }
            },
            () => {
                deleteRef.innerHTML = '删除';
            }
        );
    }


    @ViewChild('optionComponent') optionComponent:DeptOptionComponent;
    onModalOpen(id: string) {
        this.optionComponent.onModalOpen(id);
    }


    resetSearchObject() {
        this.searchObj = {}
    }

    keyEnter($event: KeyboardEvent) {
        if($event.key === 'Enter'){
            this.searchList();
        }
    }
}
